/*
 * @Author: 吴世扬 18368095041@163.com
 * @Date: 2024-09-24 16:35:19
 * @LastEditors: 吴世扬 18368095041@163.com
 * @LastEditTime: 2024-10-18 15:15:26
 * @FilePath: /react18-vite-admin/src/components/ui/Breadcrumb/Breadcrumb.tsx
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
 */
import { type ItemType } from 'antd/es/breadcrumb/Breadcrumb';
import { Breadcrumb as AntdBreadcrumb } from 'antd';

import { useAppStore, usePermissionStore } from '@/store';
import { treeToArray } from '@/utils';

import './Breadcrumb.scoped.scss';

const Breadcrumb = () => {
    const { activeIds } = useAppStore((state) => state);

    const { menuTree } = usePermissionStore((state) => state);
    const menuList = treeToArray(menuTree);

    const items: ItemType[] = activeIds.map((id) => {
        const target = menuList.find((item) => `${item.id}` === id);
        return {
            title:  target?.meta?.title || '首页'
        };
    });

    return <AntdBreadcrumb items={items} />;
};

export default Breadcrumb;
